import styles from './LoadingBox.module.scss'
import LoadingAnimate from '@/components/animate/LoadingAnimate'

const LoadingBox = defineComponent({
  props: {
    isShowContentInLoading: {
      type: Boolean,
      default: true,
    },
    loading: {
      type: Boolean,
      default: false,
    },
    loadingText: {
      type: String,
      default: '数据请求中...',
    },
  },
  setup(props, { slots }) {
    console.log('!props.isShowContentInLoading && props.loading', !props.isShowContentInLoading && props.loading)
    return () => (
      <div class={styles.container}>
        {!props.isShowContentInLoading && props.loading
          ? null
          : slots.default
          ? slots.default()
          : null}
        {props.loading ? (
          <div class={styles.loadingMask}>
            <LoadingAnimate speed={1} class={styles.loadingRect} />
            <div class={styles.text}>{props.loadingText}</div>
          </div>
        ) : null}
      </div>
    )
  },
})
export default LoadingBox;